<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Smile</title>
    <!-- 引入 bootstar.css -->
   <link rel="stylesheet" th:href="@{/static/css/bootstrap.css}">
   <link rel="stylesheet" th:href="@{/static/css/photo.css}">
   <script src="/static/js/scriptindex.js"></script>
   <script src="/static/js/jquery.min.js"></script>
   <script src="/static/js/bootstrap.js"></script>
</head>
<body>
<script type="text/javascript">
   function bj(){
	  var opacity = document.getElementById("daohang").style.opacity;
	  if(opacity<1){
	    document.getElementById("daohang").style.opacity=1;
	  }else{
	    document.getElementById("daohang").style.opacity=0.8;
	  }
	 
	  if( ($("#fill").css("display"))!="none"){
	    $("#fill").css("display","none");
	  }else{
	    $("#fill").css("display","list-item");
	  }
	  }
	  
	    
	 //这个不是写在首页，写在子页面（子页面才能返回，写在首页点击返回就是退出）
//不用引入mui.js，都是h5方法
document.addEventListener('plusready', function() {
    var webview = plus.webview.currentWebview();
    plus.key.addEventListener('backbutton', function() {
        webview.canBack(function(e) {
            if(e.canBack) {
                webview.back();
            } else {
                webview.close(); //hide,quit
                //plus.runtime.quit();
            }
        })
    });
});
	  
	  
</script>

   <!-- 头部的模板 -->
<div th:replace="fragment/head::head"></div> 
    
 
    

    
    <div class="container mt-4">
    
      <div class="row">
        <div class="col-12">
        
           <div class="card text-center"> 
               <div class="card-body ">
                 <div class="layui-anim layui-anim-down card-title"><h3>Smile-相册</h3></div>
               </div>
           </div>
         
          </div>
      </div>
    
       <div class="row" style="margin-top: 20px">
       
         <div style="margin-top:10px" th:each="phototype:${phototypes}"  class="col-6 col-sm-6 col-md-4">
         <a th:href="@{'/photos?id='+${phototype.id}}" class="lianjie">
          <div class="layui-anim layui-anim-up">
             <img id="typeimg"  class=" img-thumbnail" th:src="${phototype.imgurl}">
             <p style="margin-top:3px">&nbsp;&nbsp; <strong th:text="${phototype.name}"></strong> </p>
             <p style="color:darkgray">&nbsp;&nbsp;&nbsp;<span th:text="${phototype.sum.size()}"> </span>张</p>
          </div>
          </a>
          
         </div>
   
          
        
   
   
   <!-- 对应row -->      
   </div>
       
       
       
    </div>
    
       
    
    
    
    
    
    </body>
    </html>
    